/* 交互1：评分随点击星星个数增加 根据选中星星个数变化颜色等级 */
let addEvent = document.addEventListener ?
	(elem, type, listener, useCapture) => {
		elem.addEventListener(type, listener, useCapture);
	} :
	(elem, type, listener, useCapture) => {
		elem.attachEvent('on' + type, listener);
	};
let $ = selector=>{
	return [].slice.call(document.querySelectorAll(selector));
};
let stars = $('.star');
let oRateText = $('.rateText')[0];
let oRate = $('.rate.f-cb')[0];
let starImg = './img/favor.png';
let starImgActive = './img/favor_blue.png';

/* 将事件注册到父标签上 */
addEvent(oRate,'click',(ev)=>{
	let flag = Number.parseInt(ev.target.dataset.flag);
	console.log(flag);
	let flagText;
	switch(flag){
		case 0:
			flagText='极差';
			starImgActive = './img/favor_red.png';
		break;
		case 1:
			flagText='失望';
			starImgActive = './img/favor_red.png';
		break;
		case 2:
			flagText='一般';
			starImgActive = './img/favor_orange.png';
		break;
		case 3:
			flagText='满意';
			starImgActive = './img/favor_blue.png';
		break;
		case 4:
			flagText='惊喜';
			starImgActive = './img/favor_blue.png';
		break;
	}
	oRateText.innerHTML = flagText;
	let preStars = stars.slice(0,flag+1);
	let sufStars = stars.slice(flag+1);
 
	for(let preStar of preStars){
		preStar.src = starImgActive;
	}
	for(let sufStar of sufStars){
		sufStar.src = starImg;
	}
});



/* 交互2：根据后台返回的星星个数，星星对应显示不同颜色  福州*/
// let score = 2;
// for (let i = 0; i < score; i++) {
// 	let url, str;
// 	let flagText = '';
// 	if (score > 1 && score <= 2) {
// 		flagText = '极差';
// 		url = './img/favor_red.png';
// 		str = "<div><img src="+url+" class='star' /></div>";
// 		$('.rate').append(str);
// 	}else if (score > 2 && score <= 3) {
// 		flagText = '一般';
// 		url = './img/favor_orange.png';
// 		str = "<div><img src='./img/favor_orange.png' class='star' /></div>";
// 		$('.rate').append(str);
// 	} else if (score > 3 && score <= 5) {
// 		flagText = '惊喜';
// 		url = './img/favor_blue.png';
// 		str = "<div><img src='./img/favor_blue.png' class='star' /></div>";
// 		$('.rate').append(str);
// 	}
// 		$('.rateText').empty();
// 		$('.rateText').html(flagText);
// }
